<!DOCTYPE html>
<html lang="zh-CN">

<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1">
  <title>阿里百秀-发现生活，发现美!</title>
  <link rel="stylesheet" href="assets/css/style.css">
  <link rel="stylesheet" href="assets/vendors/font-awesome/css/font-awesome.css">
  <script src="./assets/vendors/art-template/template-web.js"></script>

</head>

<body>
  <div class="wrapper">
    <div class="topnav">
      <ul>
        <li><a href="javascript:;"><i class="fa fa-glass"></i>奇趣事</a></li>
        <li><a href="javascript:;"><i class="fa fa-phone"></i>潮科技</a></li>
        <li><a href="javascript:;"><i class="fa fa-fire"></i>会生活</a></li>
        <li><a href="javascript:;"><i class="fa fa-gift"></i>美奇迹</a></li>
      </ul>
    </div>
    <div class="header">
      <h1 class="logo"><a href="index.html"><img src="assets/img/logo.png" alt=""></a></h1>
      <ul class="nav">
        <li><a href="javascript:;"><i class="fa fa-glass"></i>奇趣事</a></li>
        <li><a href="javascript:;"><i class="fa fa-phone"></i>潮科技</a></li>
        <li><a href="list.html"><i class="fa fa-fire"></i>会生活</a></li>
        <li><a href="javascript:;"><i class="fa fa-gift"></i>美奇迹</a></li>
      </ul>
      <div class="search">
        <form>
          <input type="text" class="keys" placeholder="输入关键字">
          <input type="submit" class="btn" value="搜索">
        </form>
      </div>
    </div>
    <div class="aside">
      <div class="widgets">
        <h4>搜索</h4>
        <div class="body search">
          <form>
            <input type="text" class="keys" placeholder="输入关键字">
            <input type="submit" class="btn" value="搜索">
          </form>
        </div>
      </div>
      <div class="widgets">
        <h4>随机推荐</h4>
        <ul class="body random">
        </ul>
      </div>
      <div class="widgets">
        <h4>最新评论</h4>
        <ul class="body discuz">
        </ul>
      </div>
    </div>
    <div class="content">
      <!-- 获取文章具体内容 -->
      <div class="article" id="article">
      </div>
      <div class="panel hots">
        <h3>热门推荐</h3>
        <ul class="tuijian">
        </ul>
      </div>
    </div>
    <div class="footer">
      <p>© 2016 XIU主题演示 本站主题由 themebetter 提供</p>
    </div>
  </div>
  <!-- 获取评论 -->
  <script type="text/html" id="comment">
    {{each data}}
    <li>
      <a href="javascript:;">
        <div class="avatar">
          <img src={{$value.avatar}} alt="">
        </div>
        <div class="txt">
          <p>
            <span></span>{{$value.createAt|dataFormat}}说:
          </p>
          <p>{{$value.content}}</p>
        </div>
      </a>
    </li>
    {{/each}}
  </script>

  <!-- 热门推荐模板 -->
  <script type="text/html" id="hot">
    {{each data}}
    <li>
      <a href="javascript:;">
        <img src="uploads/hots_2.jpg" alt="">
        <span>{{$value.title}}</span>
      </a>
    </li>
    {{/each}}
    </script>
  <!-- 获取文章 具体内容 -->
  <script type="text/html" id="juti">
      <div class="breadcrumb">
        <dl>
          <dt>当前位置：</dt>
          <dd><a href="javascript:;">{{title}}</a></dd>
          <dd>{{content}}</dd>
        </dl>
      </div>
      <h2 class="title">
        <a href="javascript:;">{{content}}</a>
      </h2>
      <div class="meta">
        <span>{{author}} 发布于 {{updateAt|dataFormat}}</span>
        <span>分类: <a href="javascript:;">{{title}}</a></span>
        <span>阅读: ({{meta.views}})</span>
        <span>评论: ({{meta.comments}})</span>
      </div>
    </script>
  <!-- 随机推荐模板 -->
  <script type="text/html" id="random">
  {{each data}}
  <li>
    <a href="javascript:;">
      <p class="title">{{$value.title}}</p>
      <p class="reading">阅读({{$value.meta.comments}})</p>
      <div class="pic">
        <img src="" alt="">
      </div>
    </a>
  </li>
  {{/each}}
  </script>
  <script src="assets/vendors/jquery/jquery.min.js"></script>
  <script src="./assets/headJs/detail.js"></script>
  <script src="./assets/headJs/common.js"></script>
</body>

</html>